<template>
	<view>
		<custom-nav-sq-xcx :isBack="true" currBg="usuallyBg" :needConBlock="true">
			<block slot="content">规划计划</block>
		</custom-nav-sq-xcx>
		<view class="sqConBlock"></view>
		<view class="sqConWrap posAbso noPadd" :style="{top:(navHeight+20) + 'px'}">
			<view class="newsTab hasFlex alignCen">
				<view class="newsTabItem"
					:class="[tabIndex == index ? 'active' : '']"
					v-for="(item,index) in newsTab"
					:key="index"
					@switchSubItem="switchSubItem(index,item.id)"
				>{{item.name}}<view class="lineView two"></view></view>
			</view>
			<view class="newsTabCon">
				<swiper class="swiper" :current="tabIndex" :skip-hidden-item-layout="true" :duration="tranDuration" @animationfinish="swiperChange" style="height:100%;">
					<swiper-item v-for="(item,index) in newsList" :key="index">
						<scroll-view scroll-y style="height: 100%;" upper-threshold="50"  @scrolltolower="loadMore(index)">
							<template v-if="item.firstload">
								<template v-if="item.isHasDataFlag">
									<view class="padd">
										<gh-plan></gh-plan>
									</view>
									<!-- <block v-for="(itemInner,indexInner) in item.list" :key="indexInner">
										<view class="padd">
											<gh-plan></gh-plan>
										</view>
									</block> -->
								</template>
								<template v-else-if="item.isHasDataFlag == false"> 
									<!-- 无数据 -->
									<no-data-sq topType="specal" msgTxt="暂无记录"></no-data-sq>
								</template>
							</template>
							<template v-else> 
								<view class="loadingTxt">
									<loading :cirSize="20"></loading>
								</view>
							</template>
						</scroll-view>
					</swiper-item>
				</swiper>
			</view>
		</view>
	</view>
</template>

<script>
	import GhPlan from './components/GhPlan'
	import HonorList from './components/HonorList'
	export default {
		components:{
			GhPlan
		},
		data(){
			return{
				newsTab:[
					{id:1,name:'三年规划'},
					{id:2,name:'年度计划'}
				],
				tabIndex:0,
				tranDuration:300,
				navHeight:getApp().globalData.navHeight,
				newsList:[],
				fromType:''//plan honor
			}
		},
		onLoad(){
			/*
				if(this.mainType == 1){
					tmpArr = [
						{id:1,name:'三年规划'},
						{id:2,name:'年度计划'}
					];
					title = '规划计划';
				}else if(this.mainType == 2){//心理中心
					tmpArr = [
						{id:1,name:'流程'},
						{id:2,name:'工作制度'}
					];
					title = '心理咨询';
				}
			*/
			this.getList();
		},
		methods:{
			getList(){
				let arr = [];
				for (let i = 0; i < this.newsTab.length; i++) {
					arr.push({
						list:[],
						page:1,
						isHasDataFlag:null,
						loading:false,
						firstload:false,
						hasNextFlag:null
					});
				}
				this.newsList = arr;
				this.loadList();
			},
			loadList(){
				let currentIndex = this.tabIndex;
				let tabItem = this.newsList[currentIndex];
				tabItem.loading = true;
				setTimeout(()=>{
					tabItem.loading = false;
					tabItem.isHasDataFlag = true;
					tabItem.firstload = true;
				},1500)
				// var field = { mainType:this.mainType,groupId:this.groupId,typeName:this.typeName,page:tabItem.page,limit:this.limit };
				// getPlanList(field).then(res=>{
				// 	//console.log(res)
				// 	tabItem.hasNextFlag = res.data.hasNext;
				// 	if(tabItem.page == 1 && res.data.datas.length == 0){
				// 		tabItem.loading = false;
				// 		tabItem.isHasDataFlag = false;
				// 		tabItem.firstload = true;
				// 		return;
				// 	}
				// 	let arr = [];
				// 	let list = res.data.datas;
				// 	for (let i = 0; i < list.length; i++) {
				// 		arr.push(list[i]);
				// 	}
				// 	tabItem.isHasDataFlag = true;
				// 	tabItem.loading = false;
				// 	tabItem.list = tabItem.page > 1 ? tabItem.list.concat(arr) : arr;
				// 	tabItem.firstload = true;
				// }).catch(err=>{
				// 	console.log(err)
				// 	tabItem.firstload = true;
				// 	tabItem.isHasDataFlag = false;
				// 	tabItem.loading = false;
				// });
			},
			swiperChange(e){
				let { current } = e.target;
				this.tabIndex = current;
				//this.typeName = this.schSubTab[current].name;
				if(!this.newsList[current].firstload){
					setTimeout(()=>{ 
						this.loadList();
					},300)
				}
			},
			loadMore(index){
				if(this.newsList[index].hasNextFlag){
					this.newsList[index].page++;
					this.loadList();
				}
			},
			switchSubItem(index,id){
				this.tabIndex = index;
				//this.subTabIndex = index;
				//this.typeName = this.schSubTab[index].name;
			},
		}
	}
</script>

<style lang="scss">
	@import '@/static/scss/sqNews.scss';
</style>